import 'package:flutter/material.dart';
import 'package:flutter_app/components/avatar_role_name.dart';
import 'package:flutter_app/components/comment_like_read.dart';
import 'package:flutter_app/config/app_colors.dart';
import 'package:flutter_app/model/article_model.dart';
import 'package:flutter_app/model/video_model.dart';
import 'package:flutter_app/util/util.dart';

const double paddingSize = 20;
const double spaceSize = 10; //间距

class MaxVideoCard extends StatefulWidget {
  final VideoItem videoItem;

  const MaxVideoCard({Key key, this.videoItem}) : super(key: key);

  @override
  _MaxVideoCardState createState() => _MaxVideoCardState();
}

class _MaxVideoCardState extends State<MaxVideoCard> {
  double boxSize;

  @override
  Widget build(BuildContext context) {
    boxSize = MediaQuery.of(context).size.width - paddingSize * 2;
    return Container(
      padding: EdgeInsets.all(paddingSize),
      color: Colors.white,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _buildTitle(),
          SizedBox(height: paddingSize),
          _cover(),
          SizedBox(height: paddingSize),
          _bottom()
        ],
      ),
    );
  }

  Widget _buildTitle() {
    return Text(
      widget.videoItem.title,
      maxLines: 2,
      overflow: TextOverflow.ellipsis,
      style: TextStyle(fontSize: 16, color: AppColors.active),
    );
  }

  Widget _cover({int index = 0}) {
    return AspectRatio(
      //比例
      aspectRatio: 2 / 1,
      child: Stack(
        fit: StackFit.expand,
        children: [
          ClipRRect(
            borderRadius: BorderRadius.circular(10),
            child: FadeInImage.assetNetwork(
              placeholder: 'assets/images/common/lazy-3.png',
              image: widget.videoItem.coverPictureUrl,
              fit: BoxFit.cover,
            ),
          ),
          Center(
            child: Image.asset(
              'assets/images/icons/play_plus.png',
              width: 38,
              height: 38,
            ),
          ),
          Positioned(
              right: 10,
              bottom: 10,
              child: Container(
                padding: EdgeInsets.symmetric(vertical: 2, horizontal: 6),
                decoration: BoxDecoration(
                  color: Colors.black.withOpacity(0.5),
                  borderRadius: BorderRadius.circular(4),
                ),
                child: Text(
                  secondsToTime(widget.videoItem.contentSeconds),
                  style: TextStyle(color: Colors.white, fontSize: 12),
                ),
              ))
        ],
      ),
    );
  }

  Widget _bottom() {
    return Row(
      children: [
        Expanded(
          child: AvatarRoleName(
            avatar: widget.videoItem.user.coverPictureUrl,
            nickName: widget.videoItem.user.nickname,
            type: widget.videoItem.user.type,
          ),
        ),
        Expanded(
          child: CommentLikeRead(
            commentCount: widget.videoItem.commentCount,
            thumbUpCount: widget.videoItem.thumbUpCount,
            readCount: widget.videoItem.readCount,
          ),
        )
      ],
    );
  }
}
